<%@page import="DB.DBProvider"%>
<%@ page language="java" contentType="text/html; charset=windows-1255"
    pageEncoding="windows-1255"%>
<%@ page import="java.util.*, java.io.*,java.sql.ResultSet" %>
<%@ page errorPage="error.jsp" %>
<% 
   String user = (String)request.getSession().getAttribute("username");
   Properties p = new Properties();
   p.load(getServletContext().getResourceAsStream("/WEB-INF/config"));
   ResultSet res = (new DBProvider(p)).userDetails(user);

   if (!res.next()){
	   throw new ServletException();
	 //  response.sendError(HttpServletResponse.SC_INTERNAL_SERVER_ERROR);
//   return;
   }
	
   String firstName = res.getString("first_name");
   String lastName = res.getString("last_name");
   String phoneNumber = res.getString("phone_number"); 
%>	
<script src="validate.js" type="text/javascript"></script>
<script type="text/javascript">
	$(document).ready(function()
		{	
			$("#first").submit(function(){
			      if (!editProfileValidation(this)) {
			    	  return false; 
			      };
			      var first_name = $('[name=first_name]').val();  
			      var last_name = $('[name=last_name]').val();  
			      var number = $('[name=number]').val();  
			      var dataString = '&first_name=' + first_name + '&last_name=' + last_name + '&number=' + number;
			      $('#page').load("/Calendars/UpadateUserDetails?op=update_profile" + dataString ,function(response, status, xhr) {
					  if (status == "error") {
						    var msg = "Sorry but there was an error: ";
						    $("#page").html("<br />" +"<h1>" + msg + xhr.status + " " + xhr.statusText +"</h1>" );
						  }
						});
			      return false;
			     });
			$("#second").submit(function(){
			      if (!changePasswordValidation(this)) {
			    	  return false; 
			      };
			      var current_password = $('[name=current_password]').val();  
			      var password = $('[name=password]').val();  
			      var dataString = '&current_password=' + current_password + '&password=' + password;
			      $('#page').load("/Calendars/UpadateUserDetails?op=update_password" + dataString ,function(response, status, xhr) {
					  if (status == "error") {
						    var msg = "Sorry but there was an error: ";
						    $("#page").html("<br />" +"<h1>" + msg + xhr.status + " " + xhr.statusText +"</h1>" );
						  }
						});
			      return false;
			     });
			$('#editProfileDiv').hide();
			$('#changePasswordDiv').hide();
			
			$('#editProfile').click(function(){
					$('#profileDiv').hide();
					$('#changePasswordDiv').hide();
					$('#editProfileDiv').show();});
			
			$('#changePassword').click(function(){
				$('#profileDiv').hide();
				$('#editProfileDiv').hide();
				$('#changePasswordDiv').show();});

		});
	</script>
	
	<!-- content -->
	<div id="content" class="post"">
	 <div id="profileDiv">
		<h1 class="title"><%=user%></h1>
		<table>
			<tr>
				<td><h3>First Name: </h3></td>
				<td><%=firstName%></td>
			</tr>
			<tr>
				<td><h3>Last Name: </h3></td>
				<td><%=lastName%></td>
			</tr>
			<tr>
				<td><h3>Phone Number: </h3></td>
				<td><%=phoneNumber%></td>
				</tr>		
		</table>
	 </div>
	 <div id="editProfileDiv">
		<form id = "first">
			<table>
				<tr><td><h3>First Name:</h3></td>
					<td><input type="text" name="first_name" size="15" value="<%=firstName%>"/></td>
				</tr>
				<tr><td><h3>Last Name:</h3></td>
					<td><input type="text" name="last_name" size="15" value="<%=lastName%>"/></td>
				</tr>
				<tr><td><h3>Phone Number:</h3></td>
					<td><input type="text" name="number" size="15" value="<%=phoneNumber%>"/></td>
				</tr>
			</table>
			<input class="reg" type="submit" value="Edit my profile"></input>
		</form>
	  </div>
	  <div id="changePasswordDiv">
		<form id = "second">
			<table>
				<tr><td><h3>Current password:</h3></td>
					<td><input type="password" name="current_password" size="15"/></td>
				</tr>
				<tr><td><h3>Password:</h3></td>
					<td><input type="password" name="password" size="15"/></td>
				</tr>
				<tr><td><h3>Re-enter password:</h3></td>
					<td><input type="password" name="password2" size="15"/></td>
				</tr>
			</table>
			<input class="reg" type="submit" value="Change my password"></input>
		</form>
	  </div>
	</div>
	
	<!-- sidebar -->
	<div id="sidebar">
		<ul>
			<li><h2>Edit Profile</h2>
				<center>
					<table>
						<tr>
							<td><button id="editProfile">Click Here</button></td>
						</tr>
					</table>
				</center>
			</li>
			<li><h2>Change Password</h2>
				<center> 
					<table>
						<tr>
							<td><button id="changePassword">Click Here</button></td>
						</tr>
					</table>
				</center> 
			</li>
		</ul>
	</div>

<% //incase change password faild:
	String worngPassword = (String)request.getSession().getAttribute("worngPassword");
	if (worngPassword != null) { %>
		<script type="text/javascript"> 
		$('#changePassword').click();
			alert("Changing password Failed!\n"  +
				  "Worng password!\n" +
				  "Please re-enter current password"); 
		</script>			
<% 
	request.getSession().removeAttribute("worngPassword");
	} %>
<% //incase change password:
	String passwordchanged = (String)request.getSession().getAttribute("passwordchanged");
	if (passwordchanged != null) { %>
		<script type="text/javascript"> 
		$('#changePassword').click();
			alert("Changed password successfully!"); 
		</script>			
<% 
	request.getSession().removeAttribute("passwordchanged");
	} 

%>